import { getUserInfoAPI, loginAPI } from '@/api/user'
import router, { constantRoutes, resetRouter } from '@/router'
import { getToken, removeToken, setToken } from '@/utils/auth'
import { Message } from 'element-ui'

const state = {
  token: getToken(),
  userInfo: {},
  routes: constantRoutes // 4.7 将用户的权限路由保存到vuex中
}

const mutations = {
  // 1.通过loginActions登录成功后，将token保存到vuex中
  saveToken(state, payload) {
    state.token = payload
  },
  // 2.将用户资料保存到vuex中
  saveUserInfo(state, payload) {
    state.userInfo = payload
  },

  // 4.8 将用户的权限路由保存到vuex中
  saveUserRoutes(state, payload) {
    state.routes = [...constantRoutes, ...payload]
  }
}

const actions = {
  // 登录
  async loginActions({ commit }, payload) {
    const data = await loginAPI(payload) // 2. 发请求
    commit('saveToken', data) // 3. 保存token到vuex中
    setToken(data) // 4. 保存token到Cookies中
    router.push('/')
    Message.success('登录成功')
  },

  // 获取-用户基本资料
  async getUserInfoActions({ commit }) {
    const data = await getUserInfoAPI()
    commit('saveUserInfo', data)
  },

  // 退出登录
  logoutActions({ commit }) {
    commit('saveToken', '') // 清空vuex里的token
    commit('saveUserInfo', {}) // 清空vuex里的用户信息
    removeToken() // 清空Cookies里的token
    resetRouter() // 重置路由-防止登录高权限账号,退出之后,再次登录低权限账号可以通过路由可以访问高权限页面 原创
    router.replace('/login')
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}

